<!DOCTYPE>
<html>

<head>
    <meta charset="utf-8">
    <title>task17</title>
    <style>
     *{
         margin: 0;
         padding: 0;
     }
     .aqi-chart-wrap {
         display: flex;
         align-items: flex-end;
         margin: 30px auto;
         width: 90%;
        
     }
     .aqi-chart-wrap > div {
         flex: 1;
         border: 1px solid #000;
     }
    </style>
</head>

<body>
    <fieldset id="form-gra-time">
        <legend>请选择日期粒度：</legend>
        <label>日<input name="gra-time" value="day" type="radio" checked="checked"></label>
        <label>周<input name="gra-time" value="week" type="radio"></label>
        <label>月<input name="gra-time" value="month" type="radio"></label>
    </fieldset>

    <fieldset>
        <legend>请选择查看的城市：</legend>
        <select id="city-select">
            <option>北京</option>
        </select>
    </fieldset>

    <div class="aqi-chart-wrap">
        <div style="height: 30px;"></div>
        <div style="height: 20px;"></div>
    </div>
    <script src="js/task17.js"></script>
</body>

</html>